import React, { PureComponent } from 'react';
import _ from 'lodash';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Row, Col } from 'antd';
import { FirstHeaderC, NormalCardC, SecondHeaderC, SelectC } from '../../../comps';
import { connect } from 'dva';
import CardContent from './cardContent';
import ValuateAnalysisInfoTable from './valuateAnalysisInfoTable';

@Form.create()
@connect(({ valuationAnalysisM, loading, userM: user }) => ({ valuationAnalysisM, loading, user }))
export default class ValuateAnalysisInfo extends PureComponent {
  static defaultProps = {
    type: 1, // 1新增，2 查看详情
  };

  constructor(props) {
    super(props);
    this.state = {
      cardOneEdit: false,
      tableData: [],
      columns: [],
      dataSource: [],
      currenttotalrmbmoney: undefined, // 总计信息-当前总折算人民币金额
      currenttotalamount: undefined, // 总计信息-当前总数量
      uninvestposition: undefined, // 总计信息-未投资头寸
      time: undefined,
      analysisDates: [], // 估值解析日期列表
    };
  }

  componentDidMount() {
    this.getTime();
    this.props?.onRef && this.props?.onRef(this);
  }

  getInfo = () => {
    return {
      analysisList: this.state.tableData.map((x) => {
        const { id, ...data } = x;
        return data;
      }),
      currenttotalrmbmoney: this.state.currenttotalrmbmoney,
      currenttotalamount: this.state.currenttotalamount,
      uninvestposition: this.state.uninvestposition,
    };
  };

  getTime = () => {
    const { id, dimension } = this.props;
    this.props.dispatch({
      type: 'valuationAnalysisM/getTime',
      payload: {
        id,
        dimension,
      },
      callback: (type, data) => {
        if (type == 'success') {
          if (data?.dataSource) {
            this.setState(
              {
                analysisDates: [...data.dataSource],
                time: data?.dataSource[0] || undefined,
              },
              () => {
                if (this.state.analysisDates.length) {
                  this.getTableData({ id: this.props.id, date: this.state.analysisDates[0] });
                }
              },
            );
          }
        }
      },
    });
  };

  onTimeChange = (e) => {
    if (e) {
      this.setState({
        time: e,
      });
      this.getTableData({ id: this.props.id, date: e });
    }
  };

  // 获取表格数据
  getTableData = (params) => {
    this.setState(
      {
        dataSource: undefined,
        currenttotalrmbmoney: undefined, // 总计信息-当前总折算人民币金额
        currenttotalamount: undefined, // 总计信息-当前总数量
        uninvestposition: undefined, // 总计信息-未投资头寸
      },
      () => {
        this.props.dispatch({
          type: 'valuationAnalysisM/findanalysis',
          payload: {
            ...(params || {}),
          },
          callback: (type, data) => {
            if (type == 'success') {
              const { columns, dataSource = {} } = data?.data || {};
              const tempArr = dataSource?.analysisList || [];
              this.setState({
                columns,
                dataSource: tempArr.map((x, index) => {
                  return { ...x, assetDebtCode: x.assetDebtCode == '01' || x.assetDebtCode == null ? '--' : x.assetDebtCode, id: index };
                }),
                tableData: tempArr.map((x, index) => {
                  return { ...x, assetDebtCode: x.assetDebtCode == '01' || x.assetDebtCode == null ? '--' : x.assetDebtCode, id: index };
                }),
                currenttotalamount: dataSource.currenttotalamount,
                currenttotalrmbmoney: dataSource.currenttotalrmbmoney,
                uninvestposition: dataSource.uninvestposition,
              });
            } else {
              this.setState({
                columns,
                dataSource: [],
                tableData: [],
                currenttotalamount: undefined,
                currenttotalrmbmoney: undefined,
                uninvestposition: undefined,
              });
            }
          },
        });
      },
    );
  };

  render() {
    const { currenttotalrmbmoney, currenttotalamount, uninvestposition, columns, dataSource, analysisDates = [] } = this.state;
    return (
      <>
        {this.props.type == '1' ? <FirstHeaderC title='解析结果' /> : <SecondHeaderC style={{ marginTop: '10px' }} title='估值解析' />}
        <Row>
          <Col span={6}>
            <SelectC
              form={this.props.form} // form对象
              title='估值日期' // 显示名称
              dataIndex='date' // Form识别的下拉选项Item ID
              onChange={(e) => this.onTimeChange(e)} // 时间变化事件
              initialValue={analysisDates[0] || undefined}
              dataSource={analysisDates.map((item) => {
                return { title: item, value: item };
              })}
              allowClear={false}
            />
          </Col>
        </Row>
        <div style={{ display: 'flex' }}>
          <NormalCardC
            contentStyle={{ padding: '18px 20px' }}
            Content={
              <CardContent
                value={currenttotalrmbmoney}
                title='当前总折算人民币金额'
                precision='2'
                max={999999999999}
                unit='元'
                isEdit={this.props.type == 1}
                onSave={(e) => this.setState({ currenttotalrmbmoney: e })}
              />
            }
            style={{ margin: '10px', flex: 1 }}
            height={'100px'}
          />
          <NormalCardC
            contentStyle={{ padding: '18px 20px' }}
            Content={<CardContent title='总份额' value={currenttotalamount} precision='2' />}
            style={{ margin: '10px', flex: 1 }}
            height={'100px'}
          />
          <NormalCardC
            contentStyle={{ padding: '18px 20px' }}
            Content={
              <CardContent
                title='未投资头寸'
                value={uninvestposition}
                helper='现金'
                precision='2'
                max={999999999999}
                unit='元'
                isEdit={this.props.type == 1}
                onSave={(e) => this.setState({ uninvestposition: e })}
              />
            }
            style={{ margin: '10px', flex: 1 }}
            height={'100px'}
          />
        </div>
        <ValuateAnalysisInfoTable
          type={this.props.type}
          columns={columns}
          isStandard={this.props.isStandard}
          date={this.state.time}
          dataSource={dataSource}
          onChange={(e) => {
            this.setState({ tableData: e || [] });
          }}
        />
      </>
    );
  }
}
